<template>
  <div class="bgImg">
    <div class="cart" v-for="(item, index) in tableList" :key="index">
      <van-cell style="padding-bottom: 5px" @click="handleBuy(item)">
        <template>
          <div>
            <span>{{ item.receiver }}</span
            ><span style="float: right">{{ item.receiverContact }}</span>
          </div>
          <div class="addrs">
            <span>{{
              item.provName + item.cityName + item.countyName + item.detailAddr
            }}</span>
          </div>
        </template>
      </van-cell>
      <div class="footBox">
        <van-radio-group style="flex: 2" v-model="item.isDefault">
          <van-radio name="1" @click="handleSetUp(item)"
            >设为默认地址</van-radio
          >
        </van-radio-group>
        <div style="flex: 1">
          <a
            style="margin-right: 10px; font-size: 14px"
            @click="handleUpdate(item)"
            ><van-icon name="edit" style="font-size: 15px" />编辑</a
          >
          <a @click="handleDelete(item)"
            ><van-icon name="delete-o" style="font-size: 15px" />删除</a
          >
        </div>
      </div>
    </div>
    <!-- 无数据 -->
    <van-empty
      v-if="isEmpty"
      class="custom-image"
      :image="require('@/assets/images/empty.png')"
      description="暂无收获地址"
    />

    <div
      class="van-address-list__bottom van-safe-area-bottom"
      style="bottom: 4px"
    >
      <van-button
        block
        round
        @click="addRess"
        color="linear-gradient(to right, #ff6034, #ee0a24)"
      >
        新增地址
      </van-button>
    </div>
    <!-- 新增/详情/编辑 弹出框 -->
    <fullscreenModal
      :modal="fullscreenModal"
      :label="title"
      :editType="editType"
      :showSave="false"
      @handleClose="fullscreenModal = false"
    >
      <edit-form
        @close="fullscreenModal = false"
        @refresh="getSearch"
        ref="editFormRef"
      />
    </fullscreenModal>
    <full-loading v-if="loading"></full-loading>
  </div>
</template>

<script>
import {
  getQuery,
  editAddress,
  delAddress,
} from "@api/platframe/mainFrame/address";

import editForm from "./editForm";
export default {
  components: { editForm },
  data() {
    return {
      loading: false,
      fullscreenModal: false,
      radio: false,
      title: "新增收货地址",
      editType: "",
      isEmpty: false,
      isDefault: false,
      tableList: [],
    };
  },
  mounted() {
    this.getSearch();
  },
  methods: {
    // 查询收货地址
    getSearch() {
      this.loading = true;
      let obj = { staffId: sessionStorage.getItem("userid") };
      getQuery(obj).then((res) => {
        this.loading = false;
        this.isEmpty = true;
        if (res && res.code === 1000 && res.data) {
          this.isEmpty = false;
          this.tableList = res.data;
        }
      });
    },
    // 设置默认地址
    handleSetUp(item) {
      this.loading = true;
      editAddress(item).then((res) => {
        this.loading = false;
        if (res.code === 1000) {
          this.getSearch();
        }
      });
    },
    addRess() {
      this.fullscreenModal = true;
      this.editType = "other";
      this.title = "新增收货地址";
      this.$refs.editFormRef.resetForm();
      this.$refs.editFormRef.listNum = this.tableList.length;
      this.$refs.editFormRef.surplus = 10 - this.tableList.length;
      this.currentParam = {};
    },
    // 编辑数据
    handleUpdate(item) {
      this.fullscreenModal = true;
      this.editType = "other";
      this.title = "编辑收货地址";
      this.$refs.editFormRef.resetForm();
      this.$refs.editFormRef.listNum = this.tableList.length;
      this.$refs.editFormRef.surplus = 10 - this.tableList.length;
      this.$refs.editFormRef.getData(item);
    },
    handleDelete(item) {
      this.$Dialog
        .confirm({
          title: "是否确定删除该数据？",
        })
        .then(async () => {
          var res = await delAddress({ addrIdList: item.addrId });
          if (res.code === 1000) {
            this.$Notify({ type: "success", message: "删除成功！" });
            this.getSearch();
          }
        })
        .catch(() => {});
    },

    handleBuy(item) {
      this.$emit("refresh", item);
    },
  },
};
</script>

<style scoped lang="less">
.bgImg {
  height: calc(100% - 48px);
  overflow: auto;
  background: #f5f5f5;
}
.cart {
  margin: 10px;
  overflow: hidden;
  border-radius: 0.21333rem;
  background-color: #fff;
}
.boxs {
  height: 80px;
  color: #787878;
  display: flex;
  align-items: center;
}

.addrs {
  margin-top: 5px;
  padding-bottom: 5px;
  border-bottom: 1px solid #ccc;
}
.footBox {
  height: 30px;

  padding: 0px 16px 0px;
  display: flex;
  align-items: center;
}

.van-address-list__bottom {
  background: none;
}
</style>
